<!DOCTYPE html>
<html>
	<!-- 网页头 -->
	<head>
		<!-- 告诉浏览器用什么编码 -->
		<meta charset="utf-8">
		<!-- 让浏览器显示更优?layui上是这样写的 -->
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<!-- 在浏览器上面的页签或标题 -->
		<title>车间机台设备异常公布</title>
		<!-- 引入LayUI的样式文件 -->
		<link rel="stylesheet" href="./layui/css/layui.css">
	</head>
	<!-- 网页身 -->
	<body>
		<fieldset class="layui-elem-field site-demo-button">
			<legend><big><b>扫码报工及异常停机信息收集</b></big></legend>
			<div class="layui-form layui-row">
				<div class="layui-col-xs6 layui-col-sm6 layui-col-md4 layui-form-item">
					<input id="GXS" class="layui-input" placeholder="筛选工序" type="text" />
					<div class="layui-input-block">
						<input id="rankclick" type="checkbox" checked="" name="open" lay-skin="switch" lay-filter="switchTest" lay-text="全选|反选"/>
						<input name="GX[]" type="checkbox" title="齐纳" value="齐纳" checked lay-filter="FM"/>						<input name="GX[]" type="checkbox" title="固晶" value="固晶" checked lay-filter="FM"/>						<input name="GX[]" type="checkbox" title="焊线" value="焊线" checked lay-filter="FM"/>						<input name="GX[]" type="checkbox" title="点胶" value="点胶" checked lay-filter="FM"/>						<input name="GX[]" type="checkbox" title="切割" value="切割" checked lay-filter="FM"/>						<input name="GX[]" type="checkbox" title="分光" value="分光" checked lay-filter="FM"/>						<input name="GX[]" type="checkbox" title="编带" value="编带" checked lay-filter="FM"/>					</div> 				</div>
			</div>	
		</fieldset>
		<!-- 载入layui模块脚本 -->
		<script src="./layui/layui.js"></script>
		<!-- 载入JQuery脚本 -->
		<!-- layui论坛说不需要重复引入jQuery -->
		<script src="./js/jquery.min.js"></script>
	</body>
</html>
<!-- 脚本开始 -->
<script>
	//画面载入成功后的事件
	$(document).ready(function(){
		$("#GXS").val();
	});
	//载入layui模块
	layui.use(['layer','form','element'], function(){
		//窗口弹出方法, 自动消失
		layer.msg('画面载入成功!');
		//定义layui的form对象,不然会提示对象没定义
		var form = layui.form;
		//LayUI的监听代码,好简单
		form.on('checkbox(FM)', function(data){
			//console.log(data.elem.checked); //是否被选中，true或者false
			//console.log(data.elem.value); //复选框value值，也可以通过data.elem.value得到
			layer.msg('监听到了'+data.elem.value+'单击');
			$("#GXS").val(data.elem.value);
			//重新渲染全部form
			form.render();
			return false;
		}); 
		//监听指定开关
		form.on('switch(switchTest)', function(data){
			layer.msg('监听到了'+(this.checked ? 'true' : 'false'));
			$("input[name='GX[]']").each(function(e){
				$(this).attr("checked",(this.checked ? 'true' : 'false'));
			});
			form.render();
		});
	});
	//这里是JavaScript语音合成的模块
	//设置YY是新建的语音合成对象
	var YY = new window.SpeechSynthesisUtterance();
	//设置语音合成对象的文本
	YY.text = 
		'报工。'+
		'机台。'+
		'异常。'
	;
	//设置语音合成的语言
	YY.lang = "zh-cn";
	//设置语音合成的语速
	YY.rate = 1.2;
	//用这个方法让YY实体化(说出来)
	window.speechSynthesis.speak(YY);
</script>